feat: add easter egg CPR for sparkline pulse#1865
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
2 Skipped Deployments
|
Codecov Report❌ Patch coverage is
📢 Thoughts on this report? Let us know! |
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review infoConfiguration used: Organization UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
📝 WalkthroughWalkthroughA Vue component (WeeklyDownloadStats.vue) was modified to add an Easter egg triggered by the arrow-key sequence Up, Right, Left, Up, Left, Right entered within a 1500 ms window. Key presses are captured via onKeyDown, validated stepwise, and reset on timeout or incorrect input; a full match calls layEgg() which toggles an eggPulse state. The sparkline configuration now uses dynamic showPulse/isLoop values and the DOM wraps the sparkline with an egg-pulse-target element. New CSS adds egg-pulse, heartbeat keyframes and a prefers-reduced-motion guard. 🚥 Pre-merge checks | ✅ 1✅ Passed checks (1 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
app/components/Package/WeeklyDownloadStats.vue (2)
255-280: Ignore arrow-key input when focus is inside editable fields.At Line 255/264/273, the handler runs globally. This can accidentally trigger the easter egg while users navigate text inputs or editable regions.
Suggested refactor
+function isEditableTarget(target: EventTarget | null): boolean { + if (!(target instanceof HTMLElement)) return false + return ( + target.isContentEditable + || target.tagName === 'INPUT' + || target.tagName === 'TEXTAREA' + || target.tagName === 'SELECT' + ) +} + onKeyDown( 'ArrowUp', e => { - if (!keyboardShortcuts.value) return + if (!keyboardShortcuts.value || isEditableTarget(e.target)) return pushEasterEggKey('arrowup') }, { dedupe: true }, )
282-295: Clear pulse timer across retriggers and on unmount.At Line 293, a new timeout is created each pulse, but previous ones are not cancelled. Rapid retriggers can cut animations short, and cleanup on unmount is safer.
Suggested refactor
const eggPulse = ref(false) +let eggPulseTimeout: ReturnType<typeof window.setTimeout> | undefined function playEggPulse() { eggPulse.value = false void document.documentElement.offsetHeight eggPulse.value = true - window.setTimeout(() => { + clearTimeout(eggPulseTimeout) + eggPulseTimeout = window.setTimeout(() => { eggPulse.value = false }, 900) } onBeforeUnmount(() => { resetEasterEgg() + clearTimeout(eggPulseTimeout) })
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
app/components/Package/WeeklyDownloadStats.vue (1)
255-280: Consider collapsing duplicated arrow-key handlers.Line 255-Line 280 repeats the same logic three times. A tiny helper keeps behaviour identical while reducing drift risk.
Refactor sketch
+function bindEasterEggKey(code: 'ArrowUp' | 'ArrowRight' | 'ArrowLeft', key: CheatKey) { + onKeyDown( + code, + () => { + if (!keyboardShortcuts.value) return + pushEasterEggKey(key) + }, + { dedupe: true }, + ) +} + -onKeyDown( - 'ArrowUp', - e => { - if (!keyboardShortcuts.value) return - pushEasterEggKey('arrowup') - }, - { dedupe: true }, -) - -onKeyDown( - 'ArrowRight', - e => { - if (!keyboardShortcuts.value) return - pushEasterEggKey('arrowright') - }, - { dedupe: true }, -) - -onKeyDown( - 'ArrowLeft', - e => { - if (!keyboardShortcuts.value) return - pushEasterEggKey('arrowleft') - }, - { dedupe: true }, -) +bindEasterEggKey('ArrowUp', 'arrowup') +bindEasterEggKey('ArrowRight', 'arrowright') +bindEasterEggKey('ArrowLeft', 'arrowleft')
|
I like it :D |
3 participants
This one is for fun
Feel free to improve it, or ignore if it's over the top ^^